<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
       <script src="../js/jquery.min.js"></script>
<!--注意引入的依赖，需要注意顺序，editor.md后引入的jquery，导致editor.md依赖是没有生效的-->
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <link rel="stylesheet" href="../css/content.css">
    <link rel="stylesheet" href="../editor.md/css/editormd.min.css" />
        <script src="../editor.md/lib/marked.min.js"></script>
        <script src="../editor.md/lib/prettify.min.js"></script>
        <script src="../editor.md/editormd.js"></script>
</head>
<body>
   <div class="nav">
          <img src="../img/主页.png" alt="">
          <span>我的博客系统</span>
          <span class="space"> </span>
           <a href="blog_list.html">主页</a>
           <a href="blog_edit.html">写博客</a>
<!--通过这个a标签的href属性             -->
           <a href="logout">注销</a>
      </div>
      <class="container">
           <div class="container-left">
           <!-- 个人信息 -->
           <div class="card">
              <img  src="../img/头像2号.png" alt="">
               <h3></h3>
              <a href="https://gitee.com">gitee地址</a>
              <div class="counter">
                <span>文章</span>
                <span>分类</span>
              </div>
              <div class="counter">
                  <span>1</span>
                  <span>2</span>
            </div>
      </div>
 </div>
           <div class="container-right">
                     <h3></h3>
                     <div class="date"></div>
                     <div id="content">
                     </div>
                  </div>
<script src="../js/app.js"></script>
           <script>
              function getBlogs(){
               $.ajax({
               url:'blog'+location.search,
               type:'get',
               success:function(body){
               //根据拿到的响应数据，构造页面内容
               let h3=document.querySelector('.container-right h3');
               h3.innerHTML=body.title;
               let dateDiv=document.querySelector('.container-right .date');
              dateDiv.innerHTML=body.postTime;
              editormd.markdownToHTML('content',{markdown:body.content })
              //标题和日期都好办，但是正文不是很好办，因为在数据库中
             }
             })
             }
              getBlogs();
              checkLogin();
              function getUser() {
                          $.ajax({
                              type: 'get',
                              url: 'user' + location.search,
                              success: function(body) {
                                  // body 就是解析后的 user 对象了.
                                  let h3 = document.querySelector('.card h3');
                                  h3.innerHTML = body.username;
                              }
                          })
                      }
                      getUser();
               </script>
           <!-- 请求              如果请求不带有query string,此时就是查询博客列表
          GET/blog?blogId=1    如果请求中带有query string(blogId)此时就是查询指定博客的详细情况
           响应:                              返回一篇具体的内容
           请求Http/1.1 200 ok
           Content-Type:application/json{
              blogId:1,
              title:"这是我的第一篇博客"
              content:“从今天开始老子好好敲代码"
              userId:1,
              postTime:"2023-11-07 09:19:25" 当然约定方式可以多样，但是必须要有约定
           } -->

</body>
</html>